<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>扫雷</title>
    <link rel="stylesheet" href="css/index.css">
    <link rel="stylesheet" href="http://at.alicdn.com/t/font_1868100_q86jm05u9m.css">
    <script src="js/vue.js"></script>
    
</head>
<body>
    <div id="ui">
        <div :style="saoleiStyle" id="saolei">
            <div :id="'box'+box" v-for="box in num" @click='openMenu(box)' class="box">
                <template v-if="box == bomb" v-for="bomb in bombs">
                    <i :id="'Bomb'+box" class="iconfont icon-zhadan" style="display: none;"></i>
                    <i :id="'flag'+box" class="icon" style="display: none"></i>
                    <ul :id="box" class="menu">
                        <li @click.stop="mark(box,$event)">标记</li>
                        <li @click.stop="openBox(box)">扫雷</li>
                        <li @click.stop="closeMenu(box)">取消</li>
                    </ul>
                </template>

                <template v-else>
                    <span :id="'around'+box" style="display: none;"></span>
                    <i :id="'flag'+box" class="icon" style="display: none"></i>
                    <ul :id="box" class="menu">
                        <li @click.stop="mark(box,$event)">标记</li>
                        <li @click.stop="openBox(box)">扫雷</li>
                        <li @click.stop="closeMenu(box)">取消</li>
                    </ul>
                </template>
            </div>
        </div>

        <div id="settings" @click="dspl">
            <button @click="mid" v-show="startBtn">开始</button>
            <button @click="restart" v-show="restartBtn">重玩</button>
        </div>
    </div>

</body>
<script src="js/index.js"></script>

</html>